<template>
  <!-- 巡检计划表单弹窗 -->
  <div>
    <el-dialog
      :close-on-click-modal="false"
      v-model="visibleDialog"
      :title="props.title"
      :width="!props.isReadonly ? '1100px' : '1100px'"
      draggable
      @close="closeDialog"
      destroy-on-close
      align-center
      class="maxhDialog"
    >
      <el-form
        ref="formRef"
        :model="formData"
        :inline="true"
        :rules="rules"
        label-width="115px"
        v-show="!props.isReadonly"
      >
        <!-- <h4 class="mb-[20px] mt-[0px]">计划信息</h4> -->
        <el-tabs type="border-card">
          <el-tab-pane label="计划信息">
            <div class="form_1">
              <el-row>
                <el-col :span="8">
                  <el-form-item
                    label="计划编号"
                    prop="planNo"
                    style="width: 100%"
                  >
                    <el-input
                      v-if="!props.isReadonly"
                      v-model="formData.planNo"
                      disabled
                      placeholder="请输入计划编号"
                      clearable
                    />
                    <span v-else>{{ formData.planNo }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item
                    label="计划名称"
                    prop="planName"
                    style="width: 100%"
                  >
                    <el-input
                      v-if="!props.isReadonly"
                      v-model="formData.planName"
                      placeholder="请输入计划名称"
                      clearable
                    />
                    <span v-else>{{ formData.planName }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item
                    label="巡检类型"
                    prop="sopTypeId"
                    style="width: 100%"
                  >
                    <el-select
                      v-model="formData.sopTypeId"
                      placeholder="请选择巡检类型"
                      clearable
                      v-if="!props.isReadonly"
                      style="width: 100%"
                      @change="changeSopType"
                    >
                      <el-option
                        v-for="item in typeList"
                        :key="item.id"
                        :label="item.sopTypeName"
                        :value="item.id"
                      />
                    </el-select>
                    <span v-else>{{ formData.sopTypeId }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="作业区域" prop="locationId">
                    <el-tree-select
                      placeholder="请输入作业区域"
                      filterable
                      v-if="!props.isReadonly"
                      v-model="formData.locationId"
                      :data="locationInfoTree"
                      node-key="id"
                      style="width: 100%"
                      clearable
                      :props="{ label: 'locationName', children: 'nodes' }"
                      check-strictly
                      @node-click="changeLocation"
                      :render-after-expand="false"
                      @change="handelLocation"
                    />

                    <span v-else>{{ formData.locationName }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item
                    label="巡检周期"
                    prop="taskPeriod"
                    style="width: 100%"
                  >
                    <el-input
                      v-if="!props.isReadonly"
                      v-model="formData.taskPeriod"
                      placeholder="请输入巡检周期"
                      clearable
                      style="width: 100%"
                    >
                      <template #append>
                        <el-select
                          v-model="formData.taskPeriodUnit"
                          placeholder="单位"
                          style="width: 65px"
                        >
                          <el-option
                            v-for="item in dictionaryStore.filterDictList(
                              'TaskPeriodUnit'
                            )"
                            :key="item.value"
                            :label="item.label"
                            :value="Number(item.value)"
                          />
                        </el-select>
                      </template>
                    </el-input>
                    <span v-else>{{ formData.taskPeriod }}</span>
                  </el-form-item>
                </el-col>

                <el-col :span="8">
                  <el-form-item
                    label="执行提醒时间"
                    prop="taskRemindTime"
                    style="width: 100%"
                  >
                    <el-input
                      v-if="!props.isReadonly"
                      v-model="formData.taskRemindTime"
                      placeholder="请输入巡检执行提醒时间"
                      clearable
                    >
                      <template #append>
                        <el-select
                          v-model="formData.remindTimeUnit"
                          placeholder="单位"
                          style="width: 65px"
                        >
                          <el-option
                            v-for="item in dictionaryStore.filterDictList(
                              'reminderTime'
                            )"
                            :key="item.value"
                            :label="item.label"
                            :value="Number(item.value)"
                          />
                        </el-select>
                      </template>
                    </el-input>

                    <span v-else>{{ formData.taskRemindTime }}</span>
                  </el-form-item>
                </el-col>

                <el-col :span="8">
                  <el-form-item
                    label="到期提醒时间"
                    prop="expirationReminderTime"
                    style="width: 100%"
                  >
                    <el-input
                      v-if="!props.isReadonly"
                      v-model="formData.expirationReminderTime"
                      placeholder="请输入巡检执行提醒时间"
                      clearable
                    >
                      <template #append>
                        <el-select
                          v-model="formData.expirationReminderTimeUnit"
                          placeholder="单位"
                          style="width: 65px"
                        >
                          <el-option
                            v-for="item in dictionaryStore.filterDictList(
                              'reminderTime'
                            )"
                            :key="item.value"
                            :label="item.label"
                            :value="Number(item.value)"
                          />
                        </el-select>
                      </template>
                    </el-input>
                    <span v-else>{{ formData.expirationReminderTime }}</span>
                  </el-form-item>
                </el-col>
                <!-- <el-col :span="8">
              <el-form-item
                label="设备管理部门"
                prop="assetDepartmentId"
                style="width: 100%"
              >
                <SelectOriganizationDangerGrant
                  @change="(ids:string) => getSelectIds(ids, '管理部门')"
                  @change-data="(datas) => getSelectDatas(datas, '管理部门')"
                  :isCheckStrictly="true"
                  :isMultiple="false"
                  :disabled="false"
                  :data="dataObject('管理部门')"
                  v-if="!props.isReadonly"
                  :selectData="formData.assetDepartmentId"
                />
                <span v-else>{{ formData.assetDepartmentName }}</span>
              </el-form-item>
            </el-col> -->
                <el-col :span="8">
                  <el-form-item label="是否启用" prop="enabled">
                    <template v-if="!props.isReadonly">
                      <el-radio-group v-model="formData.enabled">
                        <el-radio :label="1">是</el-radio>
                        <el-radio :label="0">否</el-radio>
                      </el-radio-group>
                    </template>
                    <span v-else>{{
                      dictionaryStore.filterDictName("YesNo", formData.enabled)
                    }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item
                    label="计划起始日期"
                    prop="planStartDate"
                    style="width: 100%"
                  >
                    <el-date-picker
                      v-if="!props.isReadonly"
                      v-model="formData.planStartDate"
                      type="date"
                      :rules="rules.planStartDate"
                      placeholder="请选择计划起始日期"
                      format="YYYY-MM-DD"
                      value-format="YYYY-MM-DD"
                      @change="handlePlanStartDate"
                    />
                    <span v-else>{{ formData.planStartDate }}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item
                    label="计划截止日期"
                    prop="planEndDate"
                    style="width: 100%"
                  >
                    <el-date-picker
                      v-if="!props.isReadonly"
                      v-model="formData.planEndDate"
                      type="date"
                      :rules="rules.planEndDate"
                      placeholder="请选择计划截止日期"
                      format="YYYY-MM-DD"
                      value-format="YYYY-MM-DD"
                    />
                    <span v-else>{{ formData.planEndDate }}</span>
                  </el-form-item>
                </el-col>
                <!--                <el-col :span="8">-->
                <!--                  <el-form-item-->
                <!--                    label="巡检时间(小时)"-->
                <!--                    prop="planInspectionTime"-->
                <!--                    style="width: 100%"-->
                <!--                  >-->
                <!--                    <el-input-number-->
                <!--                      v-if="!props.isReadonly"-->
                <!--                      v-model="formData.planInspectionTime"-->
                <!--                      :min="0"-->
                <!--                      :precision="0"-->
                <!--                      style="width: 100%"-->
                <!--                    />-->
                <!--                    <span v-else>{{ formData.planInspectionTime }}</span>-->
                <!--                  </el-form-item>-->
                <!--                </el-col>-->
                <!-- <el-col :span="8">
              <el-form-item
                label="巡检执行部门"
                prop="executeDepartmentId"
                style="width: 100%"
              >
                <SelectOriganizationDangerGrant
                  @change="(ids:string) => getSelectIds(ids, '巡检部门')"
                  @change-data="(datas) => getSelectDatas(datas, '巡检部门')"
                  :isCheckStrictly="true"
                  :isMultiple="false"
                  :disabled="false"
                  :data="dataObject('巡检部门')"
                  v-if="!props.isReadonly"
                  :selectData="formData.executeDepartmentId"
                />
                <span v-else>{{ formData.executeDepartmentName }}</span>
              </el-form-item>
            </el-col> -->

                <el-col :span="8">
                  <el-form-item
                    label="巡检执行班组"
                    style="width: 100%"
                    prop="inspectionPlanTeamsIds"
                  >
                    <el-select
                      v-if="!props.isReadonly"
                      v-model="formData.inspectionPlanTeamsIds"
                      placeholder="请选择巡检执行班组"
                      multiple
                      collapse-tags
                      collapse-tags-tooltip
                      filterable
                      style="width: 100%"
                      @change="changeTeam"
                    >
                      <el-option
                        v-for="item in crewList"
                        :key="item.id"
                        :label="`${item.teamName}`"
                        :value="item.id"
                      />
                    </el-select>
                    <span v-else>{{ formData.inspectionPlanTeams }}</span>
                    <!-- <el-input
                  v-if="!props.isReadonly"
                  v-model="formData.executeTeamId"
                  placeholder="巡检执行班组"
                  clearable
                /> -->
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="巡检路线" style="width: 100%">
                    <el-select
                      v-if="!props.isReadonly"
                      v-model="formData.inspectionRouteId"
                      placeholder="请选择巡检路线"
                      clearable
                      collapse-tags
                      collapse-tags-tooltip
                      filterable
                      :style="`width: ${
                        formData.inspectionRouteId
                          ? 'calc(100% - 36px) !important'
                          : '100%'
                      }`"
                    >
                      <el-option
                        v-for="item in inspectionRouteList"
                        :key="item.id"
                        :label="`${item.routeName}`"
                        :value="item.id"
                      />
                    </el-select>
                    <el-link
                      type="primary"
                      v-if="formData.inspectionRouteId"
                      :underline="false"
                      style="width: 35px; justify-content: flex-end"
                      @click="openDialogdetail(formData.inspectionRouteId)"
                      >查看</el-link
                    >
                    <!-- <el-button link>查看</el-button> -->
                    <!-- <span v-else>{{ formData.inspectionRouteName }}</span> -->
                    <!-- <el-input
                  v-if="!props.isReadonly"
                  v-model="formData.executeTeamId"
                  placeholder="巡检负责人员"
                  clearable
                /> -->
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="备注" prop="remarks" style="width: 100%">
                    <el-input
                      v-if="!props.isReadonly"
                      v-model="formData.remarks"
                      placeholder="请输入备注"
                      clearable
                    />
                    <span v-else>{{ formData.remarks }}</span>
                  </el-form-item>
                </el-col>
              </el-row>
            </div>

            <div
              style="
                display: flex;
                justify-content: space-between;
                align-items: center;
              "
              v-if="!props.isReadonly"
            >
              <div class="mb-[10px] mt-[20px] text-[15px]">设备列表</div>
              <el-button
                type="success"
                plain
                @click="handleAdd"
                v-if="!props.isReadonly"
              >
                <i-ep-plus />
                新增
              </el-button>
            </div>

            <div class="formTable">
              <el-table
                :data="formData.details"
                style="width: 100%"
                :key="Math.random"
                border
                show-overflow-tooltip
              >
                <!-- <el-table-column
              type="index"
              label="序号"
              align="center"
              width="100"
            /> -->

                <el-table-column
                  label="设备编码"
                  props="assetCode"
                  min-width="150"
                >
                  <template #default="{ $index, row }">
                    <!-- <el-input
                    v-if="!props.isReadonly"
                    v-model="row.assetId"
                    placeholder="请输入设备编码"
                    clearable
                  /> -->
                    <span>{{ row.assetCode }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  label="设备名称"
                  props="assetName"
                  min-width="150"
                >
                  <template #default="{ $index, row }">
                    <!-- <el-input
                    v-if="!props.isReadonly"
                    v-model="row.taskPersonIds"
                    placeholder="请输入设备名称"
                    clearable
                  /> -->
                    <span>{{ row.assetName }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  label="设备种类"
                  props="assetTypeName"
                  min-width="150"
                >
                  <template #default="{ $index, row }">
                    <!-- <el-input
                    v-if="!props.isReadonly"
                    v-model="row.taskPersonNames"
                    placeholder="请输入设备种类"
                    clearable
                  /> -->
                    <span>{{ row.assetTypeName }}</span>
                  </template>
                </el-table-column>
                <!-- <el-table-column</span>
              label="品牌型号"
              props="sopStandardId"
              min-width="150"
            >
              <template #default="{ $index, row }">
                {{ row.assetModelNo
                }}{{ row.assetModelNo && row.assetBrandName ? "-" : ""
                }}{{ row.assetBrandName }}
              </template>
            </el-table-column> -->
                <el-table-column
                  label="设备位置"
                  props="locationName"
                  min-width="150"
                >
                  <template #default="{ $index, row }">
                    <span>{{ row.locationName }}</span>
                  </template>
                </el-table-column>
                <!-- :rules="rules.sonsopStandardId" -->
                <el-table-column
                  label="巡检人员"
                  props="taskPersonIds"
                  min-width="130"
                >
                  <template #default="{ $index, row }">
                    <el-form-item
                      :prop="'details.' + $index + '.taskPersonIds'"
                      label-width="0"
                      :rules="rules.taskPersonIds"
                    >
                      <el-select
                        v-model="row.taskPersonIds"
                        placeholder="请选择"
                        clearable
                        filterable
                        style="width: 100%"
                        @change="(e) => selectTaskPersonIds(e, $index)"
                      >
                        <el-option
                          v-for="item in personDataList"
                          :key="item.memberId"
                          :label="item.memberName"
                          :value="item.memberId"
                        />
                      </el-select>
                      <!-- personDataList -->
                      <!-- <SelectPerson
                    :key="$index"
                    :isMultiple="false"
                    :maxCollapseTags="1"
                    :showSelectPerson="filterTaskPerson(row)"
                    @get-person="
                      (id, object) => getDayPerson(id, object, $index)
                    "
                    :width="'100%'"
                  /> -->
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  label="巡检标准"
                  props="sopStandardId"
                  min-width="220"
                  align="left"
                  style="padding-top: 15px"
                >
                  <template #default="{ $index, row }">
                    <span
                      style="text-decoration: underline; cursor: pointer"
                      @click="handleSopStandard(row, $index)"
                      v-if="!row.isSopStandard && row.sopStandardName"
                      >{{ `${filterStaName(row.sopStandardId)}` }}</span
                    >

                    <span
                      style="
                        color: blue;
                        text-decoration: underline;
                        cursor: pointer;
                      "
                      @click="handleSopStandard(row, $index)"
                      v-if="!row.isSopStandard && !row.sopStandardName"
                      >{{ "请选择..." }}</span
                    >
                    <el-form-item
                      :prop="'details.' + $index + '.sopStandardId'"
                      v-if="row.isSopStandard && !row.sopStandardName"
                      :rules="rules.sopStandardId"
                      label-width="0"
                    >
                      <el-select
                        v-model="row.sopStandardId"
                        placeholder="请选择..."
                        clearable
                        filterable
                        style="width: 100%"
                        @change="(e) => handleChange(e, $index, row)"
                        @blur="hadleZcFocus(row, $index)"
                      >
                        <el-option
                          v-for="item in conditionSopStandardList"
                          :key="item.id"
                          :label="item.standardName"
                          :value="item.id"
                        />
                      </el-select>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column
                  align="center"
                  label="操作"
                  width="100"
                  v-if="!props.isReadonly"
                >
                  <template #default="scope">
                    <el-button
                      type="danger"
                      link
                      @click.stop="handleDelete(scope.$index)"
                    >
                      <i-ep-delete />
                      删除
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-tab-pane>
          <el-tab-pane label="附件上传">
            <CommonUploadFile
              :isRead="props.isReadonly"
              :files="formData.assetPhotos"
              @update-files="updateFormFiles"
              folderName="eam/equ/eaminspectionplan"
            />
          </el-tab-pane>
        </el-tabs>
      </el-form>
      <!-- <h4 class="mb-[20px] mt-[0px]" v-show="props.isReadonly">计划信息</h4> -->
      <el-descriptions
        class="margin-top"
        title=""
        :column="3"
        border
        v-show="props.isReadonly"
      >
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">计划编号</div>
          </template>

          <div style="width: 100%; word-break: break-all">
            {{ formData.planNo }}
          </div>
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">计划名称</div>
          </template>

          <div style="width: 100%; word-break: break-all">
            {{ formData.planName }}
          </div>
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">巡检类型</div>
          </template>

          <div style="width: 100%; word-break: break-all">
            {{ filterTypeName(formData.sopTypeId) }}
          </div>
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">作业区域</div>
          </template>
          {{ formData.locationName || "" }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">巡检周期</div>
          </template>

          <div style="width: 100%; word-break: break-all">
            {{ formData.taskPeriod
            }}{{
              dictionaryStore.filterDictName(
                "TaskPeriodUnit",
                formData.taskPeriodUnit
              )
            }}
          </div>
        </el-descriptions-item>

        <el-descriptions-item>
          <template #label>
            <div class="cell-item">执行提醒时间</div>
          </template>

          <div style="width: 100%; word-break: break-all">
            {{ formData.taskRemindTime
            }}{{
              dictionaryStore.filterDictName(
                "reminderTime",
                formData.remindTimeUnit
              )
            }}
          </div>
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">到期提醒时间</div>
          </template>

          <div style="width: 100%; word-break: break-all">
            {{formData.expirationReminderTime
            }}{{
              dictionaryStore.filterDictName(
                "reminderTime",
                formData.expirationReminderTimeUnit
              )
            }}
          </div>
        </el-descriptions-item>
        <!-- <el-descriptions-item>
          <template #label>
            <div class="cell-item">设备管理部门</div>
          </template>

          <div style="width: 100%; word-break: break-all">
            {{ formData.assetDepartmentName }}
          </div>
        </el-descriptions-item> -->
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">是否启用</div>
          </template>
          <el-tag v-if="formData.enabled === 1" type="">启用</el-tag>
          <el-tag v-else type="info">停用</el-tag>
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">计划起始日期</div>
          </template>

          <div style="width: 100%; word-break: break-all">
            {{
              formData.planStartDate
                ? dayjs(formData.planStartDate).format("YYYY-MM-DD")
                : ""
            }}
          </div>
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">计划截止日期</div>
          </template>

          <div style="width: 100%; word-break: break-all">
            {{
              formData.planStartDate
                ? dayjs(formData.planEndDate).format("YYYY-MM-DD")
                : ""
            }}
          </div>
        </el-descriptions-item>
        <!--        <el-descriptions-item>-->
        <!--          <template #label>-->
        <!--            <div class="cell-item">巡检时间(小时)</div>-->
        <!--          </template>-->

        <!--          <div style="width: 100%; word-break: break-all">-->
        <!--            {{ formData.planInspectionTime }}-->
        <!--          </div>-->
        <!--        </el-descriptions-item>-->
        <!-- <el-descriptions-item>
          <template #label>
            <div class="cell-item">巡检执行部门</div>
          </template>

          <div style="width: 100%; word-break: break-all">
            {{ formData.executeDepartmentName }}
          </div>
        </el-descriptions-item> -->
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">巡检路线</div>
          </template>

          <div style="width: 100%; word-break: break-all">
            {{ filterRouteName(formData.inspectionRouteId) }}
            <el-link
              type="primary"
              v-if="formData.inspectionRouteId"
              :underline="false"
              style="width: 35px; justify-content: flex-end"
              @click="openDialogdetail(formData.inspectionRouteId)"
              >查看</el-link
            >
          </div>
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <div class="cell-item">巡检执行班组</div>
          </template>

          <div style="width: 100%; word-break: break-all">
            {{ filterPlanTeams(formData.inspectionPlanTeams) }}
          </div>
        </el-descriptions-item>
        <!-- <el-descriptions-item>
          <template #label>
            <div class="cell-item">巡检执行负责人</div>
          </template>

          <div style="width: 100%; word-break: break-all">
            {{ formData.persons }}
          </div>
        </el-descriptions-item> -->

        <el-descriptions-item>
          <template #label>
            <div class="cell-item">备注</div>
          </template>
          <div style="width: 100%; word-break: break-all">
            {{ formData.remarks || "暂无备注" }}
          </div>
        </el-descriptions-item>
      </el-descriptions>
      <div class="mb-[10px] mt-[20px] text-[15px]" v-show="props.isReadonly">
        设备列表
      </div>
      <el-table
        :data="formData.details"
        style="width: 100%"
        :key="Math.random"
        v-show="props.isReadonly"
        show-overflow-tooltip
        max-height="300px"
        border
      >
        <el-table-column
          label="设备编码"
          props="assetCode"
          min-width="100"
          align="center"
        >
          <template #default="{ $index, row }">
            <span>{{ row.assetCode }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="设备名称"
          props="assetName"
          min-width="150"
          align="center"
        >
          <template #default="{ $index, row }">
            <span>{{ row.assetName }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="巡检人员"
          props="taskPersonIds"
          min-width="150"
          align="center"
        >
          <template #default="{ $index, row }">
            <span>{{ row.taskPersonNames }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="巡检标准"
          props="sopStandardId"
          min-width="220"
          align="center"
        >
          <template #default="{ $index, row }">
            <span>{{ filterStandardName(row.sopStandardId) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="设备种类"
          props="assetTypeName"
          min-width="150"
          align="center"
        >
          <template #default="{ $index, row }">
            <span
              >{{ row.assetTypeCode
              }}{{ row.assetTypeCode && row.assetTypeName ? "-" : ""
              }}{{ row.assetTypeName }}</span
            >
          </template>
        </el-table-column>
        <!-- <el-table-column label="品牌型号" props="assetModelNo" min-width="150">
          <template #default="{ $index, row }">
            {{ row.assetModelNo
            }}{{ row.assetModelNo && row.assetBrandName ? "-" : ""
            }}{{ row.assetBrandName }}
          </template>
        </el-table-column> -->
        <el-table-column
          label="设备位置"
          props="locationName"
          min-width="150"
          align="center"
        >
          <template #default="{ $index, row }">
            <span>{{ row.locationName }}</span>
          </template>
        </el-table-column>

        <!-- <el-table-column label="巡检标准" props="sopStandardId" min-width="150">
          <template #default="{ $index, row }">
            <span>{{ row.sopStandardId }}</span>
          </template>
        </el-table-column> -->
      </el-table>
      <div
        class="mb-[10px] mt-[20px] text-[15px]"
        v-show="props.isReadonly && formData.assetPhotos?.length"
      >
        附件上传
      </div>
      <el-row class="ml-[15px]">
        <CommonUploadFile
          v-show="props.isReadonly"
          :showText="formData.assetPhotos?.length > 0"
          :isRead="props.isReadonly"
          :files="formData.assetPhotos"
          @update-files="updateFormFiles"
        />
      </el-row>

      <template #footer>
        <div class="dialog-footer">
          <!-- <el-button v-if="!props.isReadonly" type="primary" :loading="loading"
            >生成任务
          </el-button> -->
          <el-button
            v-if="!props.isReadonly"
            type="primary"
            :loading="loading"
            @click="handleSubmit"
            >确 定
          </el-button>
          <el-button @click="closeDialog">取 消</el-button>
        </div>
      </template>
    </el-dialog>
    <!-- 设备选择 -->
    <eaminspectionplan-select
      v-model:visible="selectDialog.visible"
      :data="breakList"
      @echo-info="changeVisible1"
    />

    <!-- 巡检路线详情 -->
    <common-inspectionroute-edit
      :visible="addDialog.visible"
      :title="addDialog.title"
      :assetKind="Number(formData.assetKind)"
      :data="addDialog.data"
      :is-readonly="addDialog.readvisible"
      @change-visible="changeVisible"
    />
  </div>
</template>

<script setup lang="ts">
import request from "@/utils/request";
import { useDictStoreHook } from "@/store/modules/dictionary"; // 引入
const dictionaryStore = useDictStoreHook();
import { getCrewListApi } from "@/utils/commonData";
import dayjs from "dayjs";
import {
  getStandardTypesApi,
  getStandardDevicesApi,
  getMakerListApi,
  getBrandModelListApi,
} from "@/utils/commonData";
import { validateNumber, validatePositiveInteger } from "@/utils/commonHooks";

defineOptions({
  name: "EAMEAMINSPECTIONPLANADDORUPDATE",
  inheritAttrs: false,
});

const emit = defineEmits(["reset-table", "change-visible"]);

const props = defineProps({
  visible: {
    type: Boolean,
    default: () => {
      return false;
    },
  },
  title: {
    type: String,
    default: () => {
      return "";
    },
  },
  data: {
    type: Object,
    default: () => {
      return {};
    },
  },
  isReadonly: {
    type: Boolean,
    default: () => {
      return false;
    },
  },
});

/** 弹窗显示 **/
const visibleDialog = ref(false);
watch(
  () => props.visible,
  (newVal: boolean) => {
    visibleDialog.value = newVal;
    setTimeout(() => {
      formRef.value && formRef.value.clearValidate();
      if (newVal === true) {
        getStandardList();
        getPersons();
      }
    }, 50);
  }
);

/** formData定义表单数据 */
const formRef = ref(ElForm);
let formData = reactive(<any>{
  id: "",
  version: "",
  assetKind: "1",
  planNo: "",
  planName: "",
  sopTypeId: "",
  taskPeriod: "",
  taskPeriodUnit: 2,
  taskRemindTime: "",
  remindTimeUnit: 1,
  assetDepartmentId: "",
  assetDepartmentName: "",
  planStartDate: "",
  planEndDate: "",
  expirationReminderTime: "",
  expirationReminderTimeUnit: 1,
  planInspectionTime: 0,
  executeDepartmentId: "",
  executeDepartmentName: "",
  executeTeamId: "",
  executeTeamName: "",
  locationId: "",
  locationName: "",
  enabled: 1,
  inspectionRouteId: "",
  organizationId: "",
  remarks: "",
  createTime: "",
  createdUserId: "",
  createdUserName: "",
  assetTypeId: "",
  lastUpdateTime: "",
  lastUpdatedUserId: "",
  lastUpdatedUserName: "",
  // 附件上传
  assetPhotos: [],
  // 班组列表
  inspectionPlanTeams: [],
  // 班组列表ids
  inspectionPlanTeamsIds: [],
  crewName: "",
  // 班组成员列表
  persons: [],
  personsName: "",
  // 巡检路线
  locations: [],
  // 详情列表
  details: [
    // {
    //   id: "",
    //   version: "",
    //   taskPlanId: "",
    //   sort: "",
    //   assetId: "",
    //   taskPersonIds: "",
    //   taskPersonNames: "",
    //   sopStandardId: "",
    //   createTime: "",
    //   createdUserId: "",
    //   createdUserName: "",
    //   lastUpdateTime: "",
    //   lastUpdatedUserId: "",
    //   lastUpdatedUserName: "",
    // },
  ],
});

function validatePositiveInteger(
  rule: any,
  value: any,
  callback: (a?: any) => {}
) {
  if (isNaN(parseFloat(value)) && isFinite(value)) {
    callback(new Error("请输入数字"));
  } else if (!/^[+-]?\d*(\.\d*)?(e[+-]?\d+)?$/.test(value)) {
    callback(new Error("请输入数字"));
  } else if (value.toString().indexOf(".") !== -1) {
    callback(new Error("不能为小数"));
  } else if (Number(value) < 0) {
    callback(new Error("数字不能小于0"));
  } else {
    callback();
  }
}

/** rules规则 */
const rules = reactive({
  // assetKind: [],
  planNo: [
    {
      required: true,
      min: 1,
      max: 32,
      message: "长度在 1 到 32 个字符",
      trigger: "blur",
    },
  ],
  planName: [
    { min: 1, max: 50, message: "长度在 1 到 50 个字符" },
    { required: true, message: "请输入计划名称", trigger: "blur" },
  ],
  assetName: [{ required: true, message: "请选择设备", trigger: "change" }],
  sopTypeId: [
    { min: 1, max: 32, message: "长度在 1 到 32 个字符" },
    { required: true, message: "请选择巡检类型", trigger: "change" },
  ],
  taskPeriod: [
    { required: true, message: "请输入巡检周期", trigger: "blur" },
    {
      validator: validatePositiveInteger,
      trigger: "blur",
    },
  ],
  // taskPeriodUnit: [],
  taskRemindTime: [
    { required: true, message: "请输入巡检执行提醒时间", trigger: "blur" },
    {
      validator: validatePositiveInteger,
      trigger: "blur",
    },
  ],
  // remindTimeUnit: [],
  assetDepartmentId: [
    { required: true, message: "请选择设备管理部门", trigger: "change" },
  ],
  // assetDepartmentName: [
  //   { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  // ],
  planStartDate: [
    { required: true, message: "请选择计划起始时间", trigger: "change" },
    {
      validator: validatorStartData,
      trigger: "change",
    },
  ],
  planEndDate: [
    { required: true, message: "请选择计划截止时间", trigger: "change" },
    {
      validator: validatorEndData,
      trigger: "change",
    },
  ],
  expirationReminderTime: [
    { required: true, message: "请选择到期提醒时间", trigger: "change" },
    {
      validator: validatePositiveInteger,
      trigger: "blur",
    },
  ],
  // planInspectionTime: [
  //   { required: true, message: "请选择巡检时间(小时)", trigger: "change" },
  //   {
  //     validator: validateNumber,
  //     trigger: "blur",
  //   },
  // ],
  executeDepartmentId: [
    { required: true, message: "请选择巡检执行部门", trigger: "change" },
  ],
  // executeDepartmentName: [
  //   { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  // ],
  executeTeamId: [
    { required: true, message: "请选择巡检执行班组", trigger: "change" },
  ],
  persons: [{ required: true, message: "请选择巡检负责人", trigger: "change" }],
  // executeTeamName: [
  //   { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  // ],
  // enabled: [],
  // remarks: [
  //   { min: 1, max: 255, message: "长度在 1 到 255 个字符", trigger: "blur" },
  // ],
  // sonversion: [],
  // sontaskPlanId: [
  //   { min: 1, max: 32, message: "长度在 1 到 32 个字符", trigger: "blur" },
  // ],
  // sonsort: [],
  // sonassetId: [
  //   { min: 1, max: 32, message: "长度在 1 到 32 个字符", trigger: "blur" },
  // ],
  // sontaskPersonIds: [
  //   { min: 1, max: 255, message: "长度在 1 到 255 个字符", trigger: "blur" },
  // ],
  // sontaskPersonNames: [
  //   { min: 1, max: 255, message: "长度在 1 到 255 个字符", trigger: "blur" },
  // ],
  sonsopStandardId: [
    { required: true, message: "请选择巡检人员", trigger: "change" },
  ],
  taskPersonIds: [
    // { required: true, message: "请选择巡检人员", trigger: "change" },
  ],
  sopStandardId: [
    { required: true, message: "请选择巡检标准", trigger: "change" },
  ],
  // soncreateTime: [],
  // soncreatedUserId: [
  //   { min: 1, max: 32, message: "长度在 1 到 32 个字符", trigger: "blur" },
  // ],
  // soncreatedUserName: [
  //   { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  // ],
  // sonlastUpdateTime: [],
  // sonlastUpdatedUserId: [
  //   { min: 1, max: 32, message: "长度在 1 到 32 个字符", trigger: "blur" },
  // ],
  // sonlastUpdatedUserName: [
  //   { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  // ],
  inspectionPlanTeamsIds: [
    {
      required: true,
      validator: validatorInspectionPlanTeams,
      trigger: "change",
    },
  ],
});
// 巡检执行班组
function validatorInspectionPlanTeams(rule, value, callback: (a?: any) => {}) {
  if (
    !formData.inspectionPlanTeams ||
    formData.inspectionPlanTeams.length <= 0
  ) {
    //先判断空可以过
    callback(new Error("请选择巡检执行班组"));
  } else {
    return true;
  }
}

function validator(rule, value, callback: (a?: any) => {}) {
  console.log(value);

  if (!value && value !== 0) {
    //先判断空可以过
    callback(new Error("请输入巡检执行提醒时间"));
  } else {
    if (/^[+]{0,1}(\d+)$/.test(value)) {
      //验证正整数和0的正则
      return true;
    } else {
      callback(new Error("请输入数字"));
    }
  }
}
function validatorStartData(rule, value, callback: (a?: any) => {}) {
  console.log(value);

  if (!value) {
    //先判断空可以过
    callback(new Error("请选择时间"));
  } else {
    // if (/^[+]{0,1}(\d+)$/.test(value)) {
    //   //验证正整数和0的正则
    //   return true;
    // } else {
    //   callback(new Error("请输入数字"));
    // }
    if (formData.planEndDate && value > formData.planEndDate) {
      callback(new Error("计划起始时间不能大于计划截止时间"));
    } else {
      return true;
    }
  }
}

function validatorEndData(rule, value, callback: (a?: any) => {}) {
  console.log(value);

  if (!value) {
    //先判断空可以过
    callback(new Error("请选择时间"));
  } else {
    // if (/^[+]{0,1}(\d+)$/.test(value)) {
    //   //验证正整数和0的正则
    //   return true;
    // } else {
    //   callback(new Error("请输入数字"));
    // }
    if (formData.planStartDate && value < formData.planStartDate) {
      callback(new Error("计划截止时间不能小于计划起始时间"));
    } else {
      return true;
    }
  }
}

const isValidated = ref(false);
/** 删除行 */
const handleDelete = (index: any) => {
  formData.details.splice(index, 1);
  isValidated.value && formRef.value.validate(() => {});
};

const details = {
  id: "",
  version: "",
  taskPlanId: "",
  sort: "",
  assetId: "",
  taskPersonIds: "",
  taskPersonNames: "",
  sopStandardId: "",
  createTime: "",
  createdUserId: "",
  createdUserName: "",
  lastUpdateTime: "",
  lastUpdatedUserId: "",
  lastUpdatedUserName: "",
};

/** 添加行 */
const handleAdd = () => {
  if (formData.inspectionPlanTeamsIds.length <= 0) {
    ElMessage.warning("请选择巡检执行班组");
    return;
  }
  selectDialog.value.visible = true;
  if (formData.details.length > 0) {
    getBreakList();
  }
  // let sondata = JSON.parse(JSON.stringify(details));
  // formData.details.push(sondata);
};

const selectDialog = ref({
  visible: false,
});
const changeVisible1 = (val: any) => {
  console.log("breakList.value", formData.details);
  const elderDetails = JSON.parse(JSON.stringify(formData.details ?? []));

  if (val && val.length) {
    formData.details = [];
    console.log("返回的数据", val);
    val?.forEach((item: any) => {
      const current = elderDetails.filter(
        (self) => self.assetId === item.id
      )?.[0];
      if (current) {
        formData.details.push(current);
      } else {
        formData.details.push({
          assetId: item.id,
          assetCode: item.assetCode,
          assetName: item.assetName,
          locationBeforeGrantId: item.locationId,
          locationBeforeGrant: item.locationName,
          assetModelId: item.assetModelId,
          assetModelNo: item.assetModelNo,
          assetBrandId: item.assetBrandId,
          assetBrandName: item.assetBrandName,
          locationId: item.locationId,
          locationName: item.locationName,
          assetTypeId: item.assetTypeId,
          assetTypeCode: item.assetTypeCode,
          assetTypeName: item.assetTypeName,
          isSopStandard: false,
        });
      }
    });
  } else {
    formData.details = [];
  }
  // selectDialog.visible = val;
};

// 点击角色下拉框 进行id赋值

function selectTaskPersonIds(e, index) {
  if (e) {
    const current =
      personDataList.value.filter((item: any) => item.memberId === e)[0] || {};
    formData.details[index].taskPersonIds = current.memberId || "";
    formData.details[index].taskPersonNames = current.memberName || "";
  } else {
    formData.details[index].taskPersonIds = "";
    formData.details[index].taskPersonNames = "";
  }
}

// 标准作业列表
const standardList = ref(<any>[]);
async function getStandardList() {
  const data = await request({
    url: "/eam/eamsopstandard/getList",
    method: "post",
    data: { sopTypeCode: formData.sopTypeCode || "", taskKind: "1" },
    // data: { sopTypeCode: "EquipPrecisionInspect" },
  }).finally(() => {});
  standardList.value = data.data;
}

function filterStandardName(id: string) {
  if (id) {
    const current =
      standardList.value?.filter((item: any) => item?.id === id)[0] ?? {};
    return current?.standardName || "";
  } else {
    return "";
  }
}

function filterRouteName(id: string) {
  if (id) {
    const current =
      inspectionRouteList.value?.filter((item: any) => item?.id === id)[0] ??
      {};
    return current?.routeName || "";
  } else {
    return "";
  }
}

function filterTypeName(id: string) {
  if (id) {
    const current =
      typeList.value?.filter((item: any) => item?.id === id)[0] ?? {};
    return current?.sopTypeName || "";
  } else {
    return "";
  }
}

function filterPlanTeams(arr) {
  if (arr && arr.length) {
    let arrName: any = [];
    arr.map((item) => {
      arrName.push(item.teamName);
    });
    return arrName.join(",");
  } else {
    return "";
  }
}

// 新增完返回的数据用于显示选择器
const breakList = ref(<any>[]);
const getBreakList = () => {
  breakList.value = [];
  formData.details.forEach((item: any) => {
    if (item.assetId) {
      breakList.value.push({
        id: item.assetId,
        assetCode: item.assetCode,
        assetName: item.assetName,
        locationId: item.locationBeforeGrantId,
        locationName: item.locationBeforeGrant,
      });
    }
  });
  console.log("回显的数据", breakList.value);
};
/** 编辑时赋值 */
watch(
  () => props.data,
  (newVal: any) => {
    formData.id = "";
    if (newVal?.id) {
      Object.assign(formData, props.data);
      console.log("formData", formData.details);
      formData.details.forEach((item: any) => {
        item.isSopStandard = false;
      });
      if (formData.inspectionPlanTeams && formData.inspectionPlanTeams.length) {
        let ids = [];
        formData.inspectionPlanTeams.map((item) => {
          ids.push(item.teamId);
        });
        formData.inspectionPlanTeamsIds = ids;
      }
    }
  }
);

/** 关闭表单弹窗 */
function closeDialog() {
  visibleDialog.value = false;
  emit("change-visible", false);
  resetForm();
}

/** 重置表单 */
function resetForm() {
  formRef.value.resetFields();
  formRef.value.clearValidate();
  // formData.details = [JSON.parse(JSON.stringify(details))];
  formData.details = [];
  formData.id = "";
  formData.version = "";
  formData.assetKind = "";
  formData.planNo = "";
  formData.planName = "";
  formData.sopTypeId = "";
  formData.taskPeriod = "";
  formData.taskPeriodUnit = 2;
  formData.taskRemindTime = "";
  formData.remindTimeUnit = 1;
  formData.assetDepartmentId = "";
  formData.assetDepartmentName = "";
  formData.planStartDate = "";
  formData.planEndDate = "";
  formData.expirationReminderTime = "";
  formData.expirationReminderTimeUnit = 1;
  formData.planInspectionTime = 0;
  formData.executeDepartmentId = "";
  formData.executeDepartmentName = "";
  formData.executeTeamId = "";
  formData.executeTeamName = "";
  formData.locationId = "";
  formData.locationName = "";
  formData.enabled = 1;
  formData.inspectionRouteId = "";
  formData.organizationId = "";
  formData.remarks = "";
  formData.createTime = "";
  formData.createdUserId = "";
  formData.createdUserName = "";
  formData.lastUpdateTime = "";
  formData.lastUpdatedUserId = "";
  formData.lastUpdatedUserName = "";
  formData.assetPhotos = [];
  formData.inspectionPlanTeams = [];
  formData.inspectionPlanTeamsIds = [];
  formData.assetTypeId = "";
  breakList.value = [];
  // 班组成员列表
  formData.persons = [];
  // 巡检路线
  formData.locations = [];
  formData.personsName = "";
  formData.crewName = "";
}

const loading = ref(false);

/** 巡检计划保存提交 */
function handleSubmit() {
  console.log("formData", formData);

  for (let i = 0; i < formData.details.length; i++) {
    if (formData.details[i].sopStandardId == "") {
      ElMessage.error("第" + (i + 1) + "行，请选择巡检标准");
      return;
    }
  }

  formRef.value.validate(async (valid: any) => {
    if (valid) {
      console.log("formData", formData);

      loading.value = true;
      const text = formData.id ? "编辑" : "新增";
      console.log("formData", toRaw(formData));
      await request({
        url: "/eam/equRouteInspectionPlan/save",
        method: "post",
        data: formData,
      }).finally(() => {
        loading.value = false;
      });
      ElMessage.success(text + `成功`);
      closeDialog();
      emit("reset-table", formData.id);
      isValidated.value = false;
    } else {
      isValidated.value = true;
    }
  });
}

/** 选择组织机构并赋值id  start **/
function getSelectIds(ids: [] | string, item: string) {
  if (ids) {
    if (item == "巡检部门") {
      formData.executeDepartmentId = ids;
      // formData.executeDepartmentName = "";
    } else if (item == "管理部门") {
      formData.assetDepartmentId = ids;
    }
  } else {
    if (item == "巡检部门") {
      formData.executeDepartmentId = "";
    } else if (item == "管理部门") {
      formData.assetDepartmentId = "";
    }
  }
}
const dataObject = (item: string) => {
  return {
    name: item == "巡检部门" ? "巡检部门" : "管理部门",

    defaultProps: {
      children: "nodes",
      label: "organizationName",
      value: "id",
    },
    api: "/system/sysOrganization/getUsableTree",
  };
};

/** 选择组织机构并赋值Name   start **/
function getSelectDatas(datas: any, item: any) {
  if (item == "巡检部门") {
    formData.executeDepartmentName = datas.organizationName
      ? datas.organizationName
      : "";
  } else if (item == "管理部门") {
    formData.assetDepartmentName = datas.organizationName
      ? datas.organizationName
      : "";
  }
}

//班组
const crewList = ref(<any>[]);
async function getCrews() {
  crewList.value = (await getCrewListApi({ teamType: "1" })) || [];
}
// 选择班组时
const changeTeam = (e) => {
  if (e && e.length) {
    let arr: any = [];
    crewList.value.map((item: any) => {
      if (e.indexOf(item.id) != -1) {
        arr.push({ teamId: item.id, teamName: item.teamName });
      }
    });
    console.log("arr", arr);
    formData.inspectionPlanTeams = arr;

    getPersons();
  } else {
    formData.inspectionPlanTeams = [];

    getPersons();
  }
};

// 根据多选的班组获取人员
const personDataList = ref([]);
const getPersons = async () => {
  personDataList.value = [];
  await request({
    url: "/eam/eamteammember/getList",
    method: "post",
    data: {
      teamIdList: formData.inspectionPlanTeamsIds,
    },
  }).then((res) => {
    personDataList.value = res.data;
  });
};

// 获取作业类型列表
const typeList = ref(<any>[]);
async function getTypeList(value: string) {
  const params = {
    taskKind: value,
    assetKind: 1,
  };
  typeList.value = (await getStandardTypesApi(params)) ?? [];
  console.log("typeList", typeList.value);
}
getTypeList("1");

// 改变巡检类型
const changeSopType = (e) => {
  if (e) {
    typeList.value.forEach((item) => {
      if (item.id == e) {
        formData.sopTypeName = item.sopTypeName;
        formData.sopTypeCode = item.sopTypeCode;
      }
    });
    formData.details.map((self, selfIndex) => {
      formData.details[selfIndex].sopStandardName = "";
      formData.details[selfIndex].sopStandardId = "";
    });
  } else {
    formData.sopTypeName = "";
    formData.sopTypeCode = "";
  }
};

// 图片处理
function updateFormFiles(val: []) {
  formData.assetPhotos = val;
}

// 班组列表数据整理 // 返回的数据进行处理
const crewDataList = ref([]);
const handleCrewData = () => {
  formData.inspectionPlanTeamsIds?.forEach((item) => {
    crewList.value.forEach((item1) => {
      if (item1.id == item) {
        crewDataList.value.push({ crewName: item1.crewName, crewId: item1.id });
      }
    });
  });

  crewData();
};
const crewData = () => {
  let crewList1: any = [];
  crewDataList.value?.forEach((item) => {
    crewList1.push(item.crewName);
  });
  formData.crewName = crewList1.join(",");
};

//负责人数据整理
const personsList = ref([]);

const handlePersonData = () => {
  formData.persons?.forEach((item) => {
    personsList.value.forEach((item1) => {
      if (item1.id == item) {
        personDataList.value.push({
          personName: item1.personName,
          personId: item1.id,
        });
      }
    });
  });

  personData();
};
const personData = () => {
  let personList1: any = [];
  personDataList.value?.forEach((item) => {
    personList1.push(item.personName);
  });
  formData.personsName = personList1.join(",");
};

// 获取巡检路线列表
const inspectionRouteList = ref([]);
const getInspectionRouteList = async () => {
  await request({
    url: "/eam/eamInspectionRoute/getList",
    method: "post",
    data: {},
  }).then((res) => {
    inspectionRouteList.value = res.data;
    console.log(" inspectionRouteList.value", inspectionRouteList.value);
  });
};

// 打开巡检路线
const addDialog = reactive<DialogOption>({
  visible: false,
  readvisible: false,
  title: "",
  data: {},
});

// 查询详情
async function getInfo(id: string) {
  request({
    url: `/eam/eamInspectionRoute/get/${id}`,
    method: "get",
    data: { assetKind: formData.assetKind },
  })
    .then((data) => {
      addDialog.data = data.data;
      addDialog.visible = true;
    })
    .catch((res) => {
      console.log(res);
    });
}
/** 打开巡检路线表单弹窗 详情 */
function openDialogdetail(id?: any) {
  addDialog.title = "巡检路线详情";
  getInfo(id);
  addDialog.readvisible = true;
}

function changeVisible(value: boolean) {
  addDialog.visible = value;
  if (!value) {
    addDialog.data = {};
  }
}

onMounted(() => {
  getCrews();
  getInspectionRouteList();
  getAllSopStandardList();
  getLocationInfoTree();
});

// 巡检负责人选择
function getDayPerson(Ids: string[], Objects: any, index: number) {
  console.log("getDayPerson", Ids, Objects, index);

  formData.details[index].taskPersonIds = Objects[0]?.id || "";
  formData.details[index].taskPersonNames = Objects[0]?.firstName || "";
}

function filterTaskPerson(row: any) {
  return row?.taskPersonIds
    ? [
        {
          id: row.taskPersonIds,
          firstName: row.taskPersonNames,
        },
      ]
    : [];
}

const handleSopStandard = (row, index) => {
  formData.details[index].sopStandardName = "";
  formData.details[index].sopStandardId = "";
  formData.details[index].isSopStandard = true;

  // indexArr.map((item) => {
  //   tableData.value[item].workCenterId = "";
  // });
  standardList.value = [];

  console.log("assetTypeId", formData.details);
  console.log(formData.sopTypeId);
  console.log(formData);

  getConditionSopStandardList(
    formData.details[index].assetTypeId,
    formData.sopTypeId
  );
};

// 获取全部标准列表
const allSopStandardList = ref([]);
const getAllSopStandardList = async () => {
  await request({
    url: "/eam/eamsopstandard/getList",
    method: "post",
    data: {taskKind: "1"},
  }).then((res) => {
    allSopStandardList.value = res.data;
    console.log("allSopStandardList.value", allSopStandardList.value);
  });
};

function filterStaName(id: string) {
  if (id) {
    const current =
      allSopStandardList.value?.filter((item: any) => item?.id === id)[0] ?? {};
    return current?.standardName || "";
  } else {
    return "";
  }
}

// 获取条件标准列表
const conditionSopStandardList = ref([]);
const getConditionSopStandardList = async (assetTypeId, sopTypeId) => {
  await request({
    url: "/eam/eamsopstandard/getList",
    method: "post",
    data: {
      sopTypeId: sopTypeId || "",
      assetTypeId: assetTypeId || "",
      taskKind: "1",
    },
  }).then((res) => {
    conditionSopStandardList.value = res.data;
  });
};
const handleChange = (e, index) => {
  if (e) {
    conditionSopStandardList.value.forEach((item) => {
      if (item.id == e) {
        formData.details[index].sopStandardName = item.standardCode || "";
        formData.details[index].sopStandardId = item.id || "";
        console.log(formData.details[index].sopStandardName);
      }
    });
  } else {
    formData.details[index].sopStandardName = "";
    formData.details[index].sopStandardId = "";
  }
  // formData.details[index].isSopStandard = false;
};
const hadleZcFocus = (row, index) => {
  formData.details[index].isSopStandard = false;
};

const handlePlanStartDate = async () => {
  const { data } = await request({
    url: "/eam/equRouteInspectionPlan/getPlanNoByStartDate",
    method: "get",
    params: { planStartDate: formData.planStartDate },
  });
  formData.planNo = data;
};
// 获取位置信息下拉树
const locationInfoTree = ref([]);
const getLocationInfoTree = async () => {
  const { data } = await request({
    url: "/eam/locationInfo/getTree",
    method: "POST",
    data: {
      enabled: 1,
    },
  });
  locationInfoTree.value = data;
};
// 点击位置树
const changeLocation = (e) => {
  if (e) {
    formData.locationId = e.id;
    formData.locationName = e.locationName;
  } else {
    formData.locationId = "";
    formData.locationName = "";
  }
};
const handelLocation = (e) => {
  if (!e) {
    formData.locationId = "";
    formData.locationName = "";
  }
};
</script>

<style lang="scss" scoped>
h4 {
  font-weight: 400;
  color: #000;
  padding-left: 10px;
  font-size: 14px;
  line-height: 14px;
}

.form_1 {
  :deep(.el-form-item) {
    width: 95% !important;
  }
}
.formTable {
  :deep(.el-form-item) {
    margin-right: 0 !important;
  }
  :deep(.el-scrollbar__wrap) {
    max-height: 290px;
    overflow-y: auto;
  }
}

.formTable {
  :deep(.el-form-item) {
    margin: 0 0 13px 0 !important;
    width: 100%;
  }
}

:deep(.el-dialog .formTable .el-table .el-form-item) {
  padding: 11px 0 0 0 !important;
}
:deep(.el-dialog .formTable .el-table .el-form-item__error) {
  font-size: 11px !important;
}

:deep(.el-dialog .formTable .el-table) {
  // .cell.el-tooltip {
  //   padding: 0 15px;
  // }

  // .el-table__body td.el-table__cell {
  //   padding: 20;
  // }
  // .cell.el-tooltip {
  //   padding: 5px;
  // }
  .el-table__body td.el-table__cell {
    // padding: 5px !important;
    padding: 0 !important;
  }
}

// :deep(.el-dialog .el-dialog__body) {
//   overflow-y: auto;
//   height: 65vh;
// }

// :deep(.search-container .el-input.el-input--default.el-input--suffix) {
//   // 固定宽度
//   width: 190px !important;
// }

// :deep(.search-container .el-form-item--default .el-form-item__label) {
//   // 固定宽度
//   justify-content: end;
// }

:deep(.el-descriptions__label.el-descriptions__cell.is-bordered-label) {
  width: 160px;
}
:deep(.el-descriptions__content.el-descriptions__cell.is-bordered-content) {
  min-width: 180px;
}

:deep(.maxhDialog .el-dialog__body) {
  max-height: 75vh;
  overflow-y: auto;
  padding: 20px;
  min-height: 40vh;
}
:deep(.el-tag__content .el-select__tags-text) {
  max-width: 100% !important;
}
</style>
